<template>
  <!--设备运行记录-->
  <div style="padding: 20px">
    <el-card class="box-card">
      <el-button-group style="margin-bottom: 20px">
        <el-dropdown @command="handleCommand" style="margin-left: 15px">
          <span class="el-dropdown-link">
            <el-button type="primary">
              新增<i class="el-icon-arrow-down el-icon--right"></i>
            </el-button>
          </span>
          <el-dropdown-menu slot="dropdown">
            <el-dropdown-item command="a">普通入库</el-dropdown-item>
            <el-dropdown-item command="b">采购入库</el-dropdown-item>
            <el-dropdown-item command="c">领用归还</el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown>
        <el-button style="margin-left: 15px" @click="deleteData">删除</el-button>
        <el-button style="margin-left: 15px">导出</el-button>
        <el-input placeholder="请输入设备编号或名称" clearable prefix-icon="el-icon-search" suffix-icon="el-icon-s-cale"
          style="width: 250px; margin-left: 570px" />
        <el-popover placement="right" width="400" trigger="click">
          <svg-icon icon-class="caiss" style="width: 40px; height: 20px" class="pointer" slot="reference" />
        </el-popover>
      </el-button-group>
      <el-table :data="data" stripe style="width: 100%" @selection-change="handleSelectionChange">
        <el-table-column type="selection" width="55" align="center"></el-table-column>
        <el-table-column type="index" label="序号" width="50" align="center"></el-table-column>
        <el-table-column label="操作" width="100" align="center">
          <template v-slot="scope">
            <el-button type="text" @click="viewDetail(scope.row)">查看</el-button>
          </template>
        </el-table-column>
        <el-table-column prop="inboundType" label="入库类型" width="100" align="center"></el-table-column>
        <el-table-column prop="code" label="入库单号" width="100" align="center"></el-table-column>
        <el-table-column prop="inboundTheme" label="入库主题" width="100" align="center"></el-table-column>
        <el-table-column prop="inboundDate" label="入库日期" width="100" align="center"></el-table-column>
        <el-table-column prop="inboundApplicants" label="入库申请人" width="100" align="center"></el-table-column>
        <el-table-column prop="department" label="所在部门" width="100" align="center"></el-table-column>
        <el-table-column prop="warehouse" label="仓库名称" width="100" align="center"></el-table-column>
        <el-table-column prop="warehouseAdministrator" label="仓库管理员" width="100" align="center"></el-table-column>
        <el-table-column prop="inboundPersonnel" label="入库人员" width="100" align="center"></el-table-column>
        <el-table-column prop="department2" label="所在部门" width="100" align="center"></el-table-column>
        <!-- <el-table-column prop="location" label="入库数量"></el-table-column> -->
        <el-table-column prop="remark" label="备注" width="100" align="center"></el-table-column>
      </el-table>

      <el-pagination background :current-page.sync="currentPage" :page-size="pageSize" :total="total"
        layout="prev, pager, next, sizes, total" :page-sizes="[10, 20, 30, 50]" @size-change="handleSizeChange"
        @current-change="handleCurrentChange" />
    </el-card>
  </div>
</template>

<script>
import { SelectNormalWarehousing, SelectNormalWarehousing2, DeleteNormalWarehousing } from "@/api/eastjet-maintenance/tai/tai";
export default {
  data() {
    return {
      data: [],
      currentPage: 1,
      pageSize: 10,
      total: 45,
      selection: []
    };
  },
  created() {
    this.getList();
  },
  methods: {
    getList() {
      SelectNormalWarehousing2(this.currentPage, this.pageSize).then(res => {
        this.data = res.data.data.list;
        this.total = res.data.data.total;
      })
    },
    deleteData() {
      console.log("删除", this.selection);
      DeleteNormalWarehousing(this.selection).then(res => {
        if (parseInt(res.data.code) == 521) {
          this.$message.success("删除成功");
          this.getList();
        }
      })
    },
    handleSelectionChange(selection) {
      this.selection = selection;
      this.selection.forEach(item => {
        item.is_delete = 1
      })
    },
    handleSizeChange(size) {
      this.pageSize = size;
      SelectNormalWarehousing2(this.currentPage, this.pageSize).then(res => {
        this.data = res.data.data.list;
        this.total = res.data.data.total;
      })
      console.log(`每页 ${size} 条`);
    },
    handleCurrentChange(page) {
      this.currentPage = page;
      SelectNormalWarehousing2(this.currentPage, this.pageSize).then(res => {
        this.data = res.data.data.list;
        this.total = res.data.data.total;
      })
      console.log(`当前页: ${page}`);
    },
    handleCommand(command) {
      if (command === 'a') {
        this.$router.push({ path: "/bei/ku/ru/pt" });
      } else if (command === 'b') {
        this.$router.push({ path: "/bei/ku/ru/cai" });
      } else {
        this.$router.push({ path: "/bei/ku/ru/ling" });
      }
    },
    viewDetail(row) {
      console.log("查看详情", row);
      this.$router.push({ path: "/bei/ku/ru/cha", query: { code: row.code } });
    },
  },
};
</script>

<style scoped>
.text {
  font-size: 14px;
}

.item {
  padding: 18px 0;
}

.box-card {
  width: 1210px;
  height: 660px;
  margin-left: 14px;
}

.el-dropdown-link {
  cursor: pointer;
  color: #409EFF;
}

.el-icon-arrow-down {
  font-size: 12px;
}
</style>
